<!doctype html>
<html class="no-js">
<head>
  <meta charset="utf-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="description" content="">
  <meta name="keywords" content="">
  <meta name="viewport"
        content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
  <title>车生活</title>

  <!-- Set render engine for 360 browser -->
  <meta name="renderer" content="webkit">

  <!-- No Baidu Siteapp-->
  <meta http-equiv="Cache-Control" content="no-siteapp"/>

  <link rel="icon" type="image/png" href="assets/i/favicon.png">

  <!-- Add to homescreen for Chrome on Android -->
  <meta name="mobile-web-app-capable" content="yes">
  <link rel="icon" sizes="192x192" href="assets/i/app-icon72x72@2x.png">

  <!-- Add to homescreen for Safari on iOS -->
  <meta name="apple-mobile-web-app-capable" content="yes">
  <meta name="apple-mobile-web-app-status-bar-style" content="black">
  <meta name="apple-mobile-web-app-title" content="车生活"/>
  <link rel="apple-touch-icon-precomposed" href="assets/i/app-icon72x72@2x.png">

  <!-- Tile icon for Win8 (144x144 + tile color) -->
  <meta name="msapplication-TileImage" content="assets/i/app-icon72x72@2x.png">
  <meta name="msapplication-TileColor" content="#0e90d2">

  <link rel="stylesheet" href="assets/css/amazeui.min.css">
  <link rel="stylesheet" href="assets/css/app.css">
  <style type="text/css">
   
    [data-am-widget="tabs"] {
    	margin: 0 !important;
    }
    .am-tabs {
    	margin: 0;
    }
    .am-tabs-bd {
    	border: 0;
    }
    .am-tabs-bd .am-tab-panel {
    	padding: 0;
    }
    .am-list {
    	margin-bottom: 0 !important;
    }
    .am-list-news-default .am-list .am-list-item-desced {
    	margin-bottom: 5px;
    	padding-bottom: 5px;
    }
    
   
  </style>
</head>
<body>

<header data-am-widget="header" class="am-header am-header-default">
  <div class="am-header-left am-header-nav">
    <a href="javascript:history.go(-1)" class="">
      <i class="am-header-icon am-icon-chevron-left"></i>
    </a>
  </div>
  <h1 class="am-header-title">
    <a href="#title-link" class="">我的收藏</a>
  </h1>
  <div class="am-header-right am-header-nav" style="display: block;">
    <a href="javascript:;" id="nav_edit" class="">编辑</a>
  </div>
</header>
<!--分割空白-->
<div style="height: 50px;"></div>
 <div data-am-widget="tabs" class="am-tabs am-tabs-d2"   >
	  <ul class="am-tabs-nav am-cf">
	    <li class="am-active"><a href="[data-tab-panel-0]">商品服务</a></li>
	    <li class=""><a href="[data-tab-panel-1]">商家店铺</a></li>
	  </ul>
      <div class="am-tabs-bd">
      	<!--商品服务-->
        <div data-tab-panel-0 class="am-tab-panel am-active">
      		<div data-am-widget="list_news" class="am-list-news am-list-news-default" style="margin: 0;">
					  <div class="am-list-news-bd">
					    <ul class="am-list">
					      <!--缩略图在标题左边-->
					        <li class="am-g am-list-item-desced am-list-item-thumbed am-list-item-thumb-left">
					          
					          <span class="am-u-sm-1 edit-radio am-text-primary am-icon-circle-o"></span>
					          <a href="serdetail.html">
					          <div class="am-u-sm-3 am-list-thumb">
					            <img src="assets/i/sj/10.jpg" />
					          </div>
					          <div class=" am-u-sm-9 am-list-main">
					          	<h3 class="am-list-item-hd">
					              人工普通洗车&nbsp;&nbsp;&nbsp;&nbsp;
					              <span class="am-icon-rmb am-detail-price-new">18&nbsp;&nbsp;</span>
					              <span class="am-icon-rmb am-detail-price-old">30</span>
					            </h3>
					            <div  style="font-size:14px;color:#333">德国力魔汽车养护专家</div>
					            <div class="am-list-item-text am-icon-map-marker">天河区东方宝泰负一层1053商铺</div>             
					            
					            <div class="am-list-phone">
					            	<span class="am-primary am-icon-md am-icon-angle-right"></span>
					            </div>
					          </div>
					          </a>
					        </li>
					        <li class="am-g am-list-item-desced am-list-item-thumbed am-list-item-thumb-left">
					          
					          <span class="am-u-sm-1 edit-radio am-text-primary am-icon-circle-o"></span>
					          <a href="serdetail.html">
					          <div class="am-u-sm-3 am-list-thumb">
					            <img src="assets/i/sj/10.jpg" />
					          </div>
					          <div class=" am-u-sm-9 am-list-main">
					          	<h3 class="am-list-item-hd">
					              人工普通洗车&nbsp;&nbsp;&nbsp;&nbsp;
					              <span class="am-icon-rmb am-detail-price-new">18&nbsp;&nbsp;</span>
					              <span class="am-icon-rmb am-detail-price-old">30</span>
					            </h3>
					            <div  style="font-size:14px;color:#333">德国力魔汽车养护专家</div>
					            <div class="am-list-item-text am-icon-map-marker">天河区东方宝泰负一层1053商铺</div>             
					            
					            <div class="am-list-phone">
					            	<span class="am-primary am-icon-md am-icon-angle-right"></span>
					            </div>
					          </div>
					          </a>
					        </li>           
					      </ul>
					    </div>
          </div>
        </div>
        <!--商家店铺tab-->
        <div data-tab-panel-1 class="am-tab-panel ">
          
        </div>
          
      </div>
  </div>
<div class="am-g del-favour-fixed">
  <button class="del-favour am-btn am-btn-danger am-btn-block">删除 </button>
</div>
<script type="text/x-handlebars-template" id="amz-tpl">
   {{>navbar navbar}}
</script>
<script src="assets/js/jquery.min.js"></script>
<script src="assets/js/amazeui.min.js"></script>
<script src="assets/js/handlebars.min.js"></script>
<script src="assets/js/amazeui.widgets.helper.js"></script>
<script src="assets/js/app.js"></script>	
<script type="text/javascript">
$(function() {
	var navEdit = $("#nav_edit");
   navEdit.click(function (){
   	   if (navEdit.text() === '编辑') {
   	   		navEdit.text('取消');
   	   }else{
   	   		navEdit.text('编辑');
   	   }
   	    
	    	$(".edit-radio").toggle();
	    	var main = $(".am-list-main");
	    	var thumb = $(".am-list-thumb");
	    	var style = thumb.attr('style');
	    	main.toggleClass('am-u-sm-9');
	    	main.toggleClass('am-u-sm-8');
	    	$(".am-icon-circle").removeClass('am-icon-circle').addClass('am-icon-circle-o');
	    	$(".del-favour-fixed").toggle();
    	});
    	 

	$(".edit-radio").click(function (){
		$(this).toggleClass('am-icon-circle-o');
		$(this).toggleClass('am-icon-circle');
	});
   	
   	$(".del-favour").click(function (){
   		 $(".am-icon-circle").parent('li').remove();
   	});
});
    
  
</script>

</body>
</html>
